<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>皓轩旅游集团</title>
		<script src="bootstrap/js/jquery-3.5.1.slim.min.js"></script>
		<script src="bootstrap/js/bootstrap.js"></script>
		<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
	</head>
	<style>
	.qt{
		display: flex;
		text-align: center;
		margin: 50px;
	}
	.tu{margin: 10px;}
	</style>
	<body>
		<!-- 导航栏 -->
		<nav class="navbar navbar-expand-sm navbar-dark" style="background-color: darkseagreen;">
			<a class="navbar-brand" href="#"><img src="images/logo.png" width="150px"></a>
			<ul class="navbar-nav">
				<p>                              </p>
				<li class="nav-item">
					<a class="nav-link" href="#"><h2>主页</h2></a>
				</li>
				
				<p>                              </p>
				<li class="nav-item">
					<a class="nav-link" href="demo01.html"><h2>旅行计划</h2></a>
				</li>
				<p>                              </p>
				<li class="nav-item">
					<a class="nav-link" href="demo02.html"><h2>酒店</h2></a>
				</li>
				<p>                              </p>
				<li class="nav-item">
					<a class="nav-link" href="demo03.html"><h2>关于</h2></a>
				</li>
				<p>                              </p>
				<li class="nav-item">
					<a class="nav-link" href="demo04.html"><h2>游轮</h2></a>
				</li>
				<p>                              </p>
				<li class="nav-item">
					<a class="nav-link" href="demo05.html"><h2>客服联系</h2></a>
				</li>
			</ul>
		<form class="form-inline ml-auto">
			<input class="form-control" type="search" placeholder="搜索目的地" aria-label="search">
			<button class="btn btn-danger my-2 my-sm-0" type="submit">搜索</button>
		</form>
		<form class="form-inline ml-auto my-2 my-lg-0 ml-3 ">
			<a href="#" class="mr-2" style="color: #000;">登录</a>
			<a href="#" class="mr-2" style="color: #000;">注册</a>
		</form>
		</nav>
		<!-- 轮播图 -->
	<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel" data-interval="2000">
		<ol class="carousel-indicators">
			<li data-targer="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
			<li data-targer="#carouselExampleIndicators" data-slide-to="1"></li>
			<li data-targer="#carouselExampleIndicators" data-slide-to="2"></li>
			<li data-targer="#carouselExampleIndicators" data-slide-to="3"></li>
		</ol>
		
		<div class="carousel-inner">
			<div class="carousel-item active">
				<img  src="images/tupian1.jpg" class="d-block w-100 m-auto" alt="..." height="500px"/>
			</div> 
			<div class="carousel-item">
				<img  src="images/tupian2.jpeg" class="d-block w-100 m-auto" height="500px" alt="..."/>
			</div> 
			<div class="carousel-item">
				<img  src="images/tupian3.jpeg" class="d-block w-100 m-auto" height="500px" alt="..."/>
			</div> 
			<div class="carousel-item">
				<img  src="images/tupian4.jpeg" class="d-block w-100 m-auto" height="500px" alt="..."/>
			</div> 
			<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
				<span class="carousel-control-prev-icon"></span>
			</a>
			<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
				<span class="carousel-control-next-icon"></span>
			</a>
		</div>
	</div>
	
	<hr  style="border-top: 5px solid greenyellow;"/>
	
	
	<nav class="navbar navbar-expand-sm" style="background-color: aquamarine;" >
		<div class="navbar-nav container">
			<li class="nav-item">
				<a class="nav-link" href="#" style="text-align: center;"><h1>WELCOME</h1></a>
				<a><h3></br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2004年7月21日公司创立，作为中国旅游行业的领先品牌和综合运营商，中青旅坚持以创新
				为发展的根本推动力，不断推进旅游价值链的整合与延伸，在观光旅游、度假旅游、会奖旅游、差旅管理、景区开发、酒店运营等领域具有卓越的竞争优势。中
				青旅旗下拥有中青旅会展、乌镇、山水酒店、邀游网、百变自由行等一系列国内知名旅游企业和产品品牌，在北京、上海、东京、温哥华、香港、广州、天津、
				南京、杭州、深圳等海内外三十余个核心城市设有分支机构。</h3>
			</li>
		</div>
	</nav>
	
	<hr  style="border-top: 5px solid greenyellow;"/>
	
	<div class="container-fluid">
		<div class="col-sm-6" style="color: cadetblue;"><h2>当季热销</h2></div>
	</div>
	<div class="container-fluid">
		<div class="qt">
		<div class="tu">
			<a href="#">
				<div >
			<img src="imagess/1.1.1.png" width="800px" title="苏州旅游"  /></div>
			<p ><h3>苏州旅游</h3></p>
			</a>
		</div>
		<div class="tu">
			<a href="#">
				<div >
			<img src="imagess/1.1.2.png" width="800px"title="普陀山"  /></div>
			<p><h3>普陀山</h3></p>
			</a>
		</div>
		<div class="tu">
			<a href="#">
				<div >
			<img src="imagess/1.1.3.png" width="750px"title="安徽黄山"  /></div>
			<p><h3>安徽黄山</h3></p>
			</a>
			</div>		
		</div>	
	</div><div class="container-fluid">
		<div class="qt">
		<div class="tu">
			<a href="#">
				<div >
			<img src="imagess/1.1.4.png" width="800px" title="丽水旅游"  /></div>
			<p ><h3>丽水旅游</h3></p>
			</a>
		</div>
		<div class="tu">
			<a href="#">
				<div >
			<img src="imagess/1.1.5.png" width="800px"title="江苏旅游"  /></div>
			<p><h3>江苏旅游</h3></p>
			</a>
		</div>
		<div class="tu">
			<a href="#">
				<div>
			<img src="imagess/1.1.5.png" width="800px"title="江苏旅游"  /></div>
			<p><h3>江苏旅游</h3></p>
			</a>
			</div>		
		</div>	
	</div>
	
	<hr  style="border-top: 5px solid greenyellow;"/>
	
	<div class="container-fluid">
		<div class="col-sm-6" style="color: cadetblue;"><h2>特价机票</h2></div>
	</div>
	<div class="container-fluid">
		<div class="qt">
		<div class="tu">
			<a href="#">
				<div>
			<img src="imagess/1.2.1.png" width="800px" title="上海回宁波"  /></div>
			<p ><h3>上海回宁波</h3></p>
			</a>
		</div>
		<div class="tu">
			<a href="#">
				<div>
			<img src="imagess/1.2.2.png" width="800px"title="上海回郑州"  /></div>
			<p><h3>上海回郑州</h3></p>
			</a>
		</div>
		<div class="tu">
			<a href="#">
				<div>
			<img src="imagess/1.2.3.png" width="750px"title="上海回广州"  /></div>
			<p><h3>上海回广州</h3></p>
			</a>
			</div>		
		</div>	
	</div><div class="container-fluid">
		<div class="qt">
		<div class="tu">
			<a href="#">
				<div>
			<img src="imagess/1.2.4.png" width="800px" title="上海回桂林"  /></div>
			<p ><h3>上海回桂林</h3></p>
			</a>
		</div>
		<div class="tu">
			<a href="#">
				<div>
			<img src="imagess/1.2.5.png" width="800px"title="上海回南京"  /></div>
			<p><h3>上海回南京</h3></p>
			</a>
		</div>
		<div class="tu">
			<a href="#">
				<div>
			<img src="imagess/1.2.5.png" width="800px"title="上海回南京"  /></div>
			<p><h3>上海回南京</h3></p>
			</a>
			</div>		
		</div>	
	</div>
	</div>
	
	<hr  style="border-top: 5px solid greenyellow;"/>
	
	<div class="container">
		<div class="col-sm-4m col-md-12" border style="color: cadetblue;"><h1>分类导航</h1></div>
	</div>
	<div class="container">
		<div class="col-sm-4m col-md-12">
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<h2>热门景点</h2>
			<a href="#">长白山天池</a>&nbsp;&nbsp;<a href="#">告庄西双景</a>&nbsp;&nbsp;<a href="#">翠湖公园</a>&nbsp;&nbsp;<a href="#">滇池</a>
			&nbsp;&nbsp;<a href="#">金马碧鸡坊</a>&nbsp;&nbsp;<a href="#">南屏步行街</a>&nbsp;&nbsp;<a href="#">云大会泽院仰止…</a>&nbsp;&nbsp;<a href="#">石林风景区</a>
			&nbsp;&nbsp;<a href="#">海埂大坝</a>&nbsp;&nbsp;<a href="#">龙门</a>&nbsp;&nbsp;<a href="#">章朗村布朗族山…</a>&nbsp;&nbsp;<a href="#">云南陆军讲武堂...</a>
			<br />
			<a href="#">勐巴拉娜西艺术..</a>&nbsp;&nbsp;<a href="#">大观楼</a>&nbsp;&nbsp;<a href="#">长白山北坡景区</a>&nbsp;&nbsp;<a href="#">大戏台河风景区</a>
			&nbsp;&nbsp;<a href="#">文化巷</a>&nbsp;&nbsp;<a href="#">钱王街</a>&nbsp;&nbsp;<a href="#">昆明动物园</a>&nbsp;&nbsp;<a href="#">金殿公园</a>
			&nbsp;&nbsp;<a href="#">官渡古镇</a>&nbsp;&nbsp;<a href="#">云南省博物馆</a>&nbsp;&nbsp;<a href="#">六鼎山文化旅游.</a>&nbsp;&nbsp;<a href="#">轿子雪山</a>
			</div>
		</div>
	<div class="container">
			<div class="col-sm-4m col-md-12">
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<h2>2024热门目的地推荐</h2>
			<a href="#">北京旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">厦门旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">上海旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<a href="#">杭州旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">南京旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">成都旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<a href="#">丽江旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">香港旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">澳门旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<br />
			<a href="#">桂林旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">重庆旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">青岛旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<a href="#">苏州旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">大连旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">广州旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<a href="#">深圳旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">天津旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">泰国旅游攻略</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			</div>
	</div>
	
		<hr  style="border-top: 5px solid greenyellow;"/>
	
	<footer style="background-color:darkseagreen;">
		<center><p>Copyright@1999-2024, ctrip.com.All rights reserved</p></center>
		<center><p>32302140337 卢皓轩</p></center>
	</footer>
	
	</body>
</html>